$(function() {
	/*textarea宽高自适应*/
	$('.comment-content').flexText();

	//初始只显示5条评论
	$('.commentShow').each(function() {
		if($(this).children().length > 5) {
			$(this).children('.comment-show-con:nth-child(n+6)').hide();
		}
	});
	
	$('.comment-expand').click(function(){
	if($(this).parents(".comments").find('.commentAll').is(":hidden")){
		$(this).html("收起").parents(".comments").find('.commentAll').fadeIn();
	}
	else{
		$(this).html("展开").parents(".comments").find('.commentAll').fadeOut();
	}
	});
	
	/*初始化收起回复超过两条的评论*/
	$('.hf-list-con').each(function() {
		if($(this).children().length >= 3) {
			$(this).children().hide();
			$(this).siblings('.hf-expand').show();
			$(this).siblings('.hf-expand').find('.hf-count').html($(this).children().length);
		} else {
			$(this).siblings('.hf-expand').hide();
		}

	});
	
	
	/*回复展开收起*/
	$('.hf-expand').click(function() {
		if($(this).html() !== "收起") {
			$(this).siblings('.hf-list-con').children().show();
			$(this).html("收起").hide();
		} else {
			$(this).siblings('.hf-list-con').children().hide();
			//收起时计算回复数量，直接用数字替换a标签
			$(this).html("展开" + $(this).siblings('.hf-list-con').children().length + "条回复");
		}
	});
	

	$('.comment-show-con').mouseover(function() {
		if($(this).find('.hf-list-con').children().length > 0 && $(this).find('.hf-expand').html() == "收起") {
			$(this).find('.hf-expand').show();
		}
	});
	
	$('.comment-show-con').mouseout(function() {
		if($(this).find('.hf-expand').html() == "收起") {
			$(this).find('.hf-expand').hide();
		}
	});

	
});


//最大字数不超过140字
function keyUP(t) {
	var len = $(t).val().length;
	if(len > 139) {
		$(t).val($(t).val().substring(0, 140));
	}
}

/*动态回复模块*/
$('.commentAll').on('click', '.plBtn', function() {
	var myDate = new Date();
	//获取当前年
	var year = myDate.getFullYear();
	//获取当前月
	var month = myDate.getMonth() + 1;
	//获取当前日
	var date = myDate.getDate();
	var h = myDate.getHours(); //获取当前小时数(0-23)
	var m = myDate.getMinutes(); //获取当前分钟数(0-59)
	if(m < 10) m = '0' + m;
	var s = myDate.getSeconds();
	if(s < 10) s = '0' + s;
	var now = year + '-' + month + "-" + date + " " + h + ':' + m + ":" + s;
	//获取输入内容
	var oSize = $(this).siblings('.flex-text-wrap').find('.comment-input').val();
	var oName = $(this).siblings('.comment-name').val();
	//动态创建评论模块
	oHtml = '<div class="comment-show-con clearfix"><div class="comment-show-con-img "><img src="images/header-img-comment_03.png" alt=""></div> <div class="comment-show-con-list  clearfix"><div class="pl-text clearfix"> <a href="#" class="comment-size-name">' + oName + '：</a><span class="my-pl-con">&nbsp;' + oSize + '</span> </div> <div class="date-dz"> <span class="date-dz-left  comment-time">' + now + '</span> <div class="date-dz-right  comment-pl-block"><a href="javascript:;" class="removeBlock">删除</a> <a href="javascript:;" class="date-dz-pl pl-hf hf-con-block ">回复</a> </div> </div><div class="hf-list-con"></div></div> </div>';
	if(oSize.replace(/(^\s*)|(\s*$)/g, "") != '' && oName.replace(/(^\s*)|(\s*$)/g, "") != '') {
		$(this).parents('.reviewArea ').siblings('.comment-show').prepend(oHtml);
		$(this).siblings('.flex-text-wrap').find('.comment-input').prop('value', '').siblings('pre').find('span').text('');
	}
});

/*回复评论模块*/
$('.commentShow').on('click', '.hf-pl', function() {
	var oThis = $(this);
	var myDate = new Date();
	//获取当前年
	var year = myDate.getFullYear();
	//获取当前月
	var month = myDate.getMonth() + 1;
	//获取当前日
	var date = myDate.getDate();
	var h = myDate.getHours(); //获取当前小时数(0-23)
	var m = myDate.getMinutes(); //获取当前分钟数(0-59)
	if(m < 10) m = '0' + m;
	var s = myDate.getSeconds();
	if(s < 10) s = '0' + s;
	var now = year + '-' + month + "-" + date + " " + h + ':' + m + ":" + s;
	//获取输入内容
	var atName = $(this).siblings('.comment-name').val();
	var hfContent = $(this).siblings('.hf-input').val();
	var toName = $(this).parents('.hf-con').parents('.date-dz').siblings('.pl-text').find('.comment-size-name').html();
	
	if(hfContent.indexOf("@") == -1 || hfContent.indexOf(toName) == -1) {
		toName = toName.split('：')[0]; //去掉：号
		hfContent = hfContent;
	} else {
		arr = hfContent.split('：');
		ohfNameArr = arr[0].split('@');
		toName = ohfNameArr[1];
		hfContent = arr[1];
	}

	if(atName.replace(/^ +| +$/g, '') == '' || hfContent.replace(/^ +| +$/g, '') == '') {} else {
		var oHtml = '<div class="all-pl-con"><div class="pl-text hfpl-text clearfix">' +
			'<a href="#" class="comment-size-name">' + atName + '：</a><span class="my-pl-con">' +
			'回复<a href="#" class="atName">@' + toName + '：</a>' + hfContent +
			'</span></div><div class="date-dz"> <span class="date-dz-left  comment-time">' +
			now +
			'</span> ' +
			'<a href="javascript:;" class="date-dz-pl pl-hf hf-con-block ">回复</a></div></div>';
		oThis.parents('.hf-con').parents('.comment-show-con-list').find('.hf-list-con').css('display', 'block').prepend(oHtml) && oThis.parents('.hf-con').siblings('.date-dz-right').find('.pl-hf').addClass('hf-con-block') && oThis.parents('.hf-con').remove();
	}
});

/*创建回复模块*/
$('.commentShow').on('click', '.pl-hf', function() {
	//获取回复人的名字
	var fhName = $(this).parents('.date-dz').siblings('.pl-text').find('.comment-size-name').html();
	//回复@
	var fhN = '回复@' + fhName;
	var fhHtml = '<div class="hf-con"><input class="comment-name" type="text" placeholder="Your name"/> <textarea class="comment-content comment-input hf-input" placeholder="'+fhN+'" onkeyup="keyUP(this)"></textarea> <a href="javascript:;" class="hf-pl">评论</a></div>';
	//显示回复
	if($(this).is('.hf-con-block')) {
		$(this).parents('.date-dz').append(fhHtml);
		$(this).removeClass('hf-con-block');
		//input框自动聚焦
		$(this).siblings('.hf-con').find('.comment-name').focus();
	} else {
		$(this).addClass('hf-con-block');
		$(this).siblings('.hf-con').remove();
	}
});

/*
    此插件textarea的高度是 height:100%; 继承父元素的高度 ==> 父元素只有一个 position:relative; 用于定位textarea
    页面中加载完毕又添加了pre标签，pre标签是以块元素存在的并且不可见，但是占用空间，
    不像display:none;什么空间也不占。
    所以textarea父元素的高度是通过pre撑开的(在textarea里面写入文字，文字会被添加到pre底下的span标签里，以此来撑开pre的高度)
    要改变textarea初始化时的高度，只需改变pre的padding值即可，页面加载时pre里面添加<br />标签是为了让pre标签初始时有个高度
 */
(function ($) {
    // Constructor
    function FT(elem) {
        this.$textarea = $(elem);

        this._init();
    }
    FT.prototype = {
        _init: function () {
            var _this = this;
            // Insert wrapper elem & pre/span for textarea mirroring
            this.$textarea.wrap('<div class="flex-text-wrap" />').before('<pre class="pre"><span /><br /></pre>');
            this.$span = this.$textarea.prev().find('span');
            // Add input event listeners
            // * input for modern browsers
            // * propertychange for IE 7 & 8
            // * keyup for IE >= 9: catches keyboard-triggered undos/cuts/deletes
            // * change for IE >= 9: catches mouse-triggered undos/cuts/deletions (when textarea loses focus)
            this.$textarea.on('input propertychange keyup change', function () {
                _this._mirror();
            });
            
            $.valHooks.textarea = {
                get: function (elem) {
                    return elem.value.replace(/\r?\n/g, "\r\n");
                }
            };
           
            this._mirror();
        }
   
        ,_mirror: function () {
            this.$span.text(this.$textarea.val());
        }
    };
    // jQuery plugin wrapper
    $.fn.flexText = function () {
        return this.each(function () {
            // Check if already instantiated on this elem
            if (!$.data(this, 'flexText')) {
                $.data(this, 'flexText', new FT(this));
            }
        });
    };
})(jQuery);